// 低于1280px调整menu宽度和缩小menu宽
@media screen and (max-width: 1280px) {
  body #app .side-bar-container {
    width: @lowSidebarWidth !important;
  }

  body #app .side-bar .el-submenu .el-menu-item span, body #app .side-bar .el-submenu__title span {
    margin-left: 5px;
  }
  
  body #app .collapseSidebar .side-bar-container {
    width: @lowSidebarCollapseWidth !important;
  }
  body .el-menu--popup-right-start {
    margin-left: -5px !important;
  }
  body #app .footer {
    line-height: 35px;
    height: 35px !important;
  }
  body .el-submenu__title {
    padding-left: 12px!important;
  }
}

.el-menu-item-group__title{
  display: none !important;
}

.el-menu-item span{
  margin-left: 10px;

  font-size: @defFontSize;
}
#app{
  .side-bar-container {
    height: 100%;
    transition: all .28s;
    width: @sidebarWidth !important;
    margin-left: 0;
     overflow: hidden;

  }

  .side-bar {
    height: 100%;
    background: #00142a;

    .el-scrollbar {
      /deep/.el-scrollbar__wrap {
        .el-scrollbar__view {
          font-weight: lighter;
        }
      }
    }
    .el-menu--collapse{
      width: @sidebarCollapseWidth;
    }
    .el-submenu__title i, .el-menu-item i{
      color: #A1ADBD;
    }
    .el-submenu__title span{
      margin-left: 10px;
      font-size: 16px;
      font-family: Microsoft YaHei;
      font-weight: lighter;
      color: rgba(157,169,185,1);
    }
    .el-submenu .el-menu-item{
      padding-left: 35px !important;
      span{
        margin-left: 10px;
        font-size: @defFontSize;
      }
    }
    .el-main {
      margin-right: -18px;
      padding-right: 18px !important;
    }
    .el-main, .el-footer{
      display: flex;
      padding: 0;
      margin-bottom: 35px;
      padding-bottom: 20px
    }
    .el-menu{
      height: 100%;
      border: none;
    }
    .el-scrollbar{
      flex: 1;
      .el-scrollbar__wrap{
        overflow-x: hidden !important;
        .el-scrollbar__view{
          height: 100%;
        }
      }
    }
    .el-footer{
      height: 40px !important;
    }
    .btn-collapse{
      background-color: #002140;
      width: 100%;
      padding: 0;
      text-align: right;
      padding-right: 20px;
      &:hover{
        background-color: rgba(0,0,0,.3);
      }
      i{
        color: #ffffff;
        font-weight: bold;
        font-size: 18px;
      }
    }
  }
  .collapseSidebar .side-bar-container{
      width: @sidebarCollapseWidth !important
  }
  .openSidebar .side-bar-container{
      margin-left: 0;
  }
  .hideSidebar.expandSidebar .side-bar-container{
      margin-left: -(@sidebarWidth);
  }
  .hideSidebar.collapseSidebar .side-bar-container{
      margin-left: -(@sidebarCollapseWidth);
  }
}